<template>
  <div class="container">
    <!-- //头部导航 -->
    <Breadcrumb :items="['标准管理', '检测标准']" />
    <!-- 内容区块 -->
    <div class="content">
      <div class="standar-items" v-for="item in standarInfo1" :key="item">
        <!-- 标题 -->
        <h3>
          {{ item.title }}
        </h3>
        <div class="title"> </div>
        <!-- 描述 -->
        <div class="des">
          {{ item.des }}
        </div>
        <!-- 内容 -->
        <a-table
          :columns="item.columns"
          :data="item.data"
          :pagination="false"
        />
      </div>
    </div>
  </div>
</template>
<script>
  import { standarInfo } from './enums/index';
  export default {
    // data() 返回的属性将会成为响应式的状态
    // 并且暴露在 `this` 上
    data() {
      return {
        count: 0,
        standarInfo1: standarInfo,
      };
    },
    // 生命周期钩子会在组件生命周期的各个不同阶段被调用
    // 例如这个函数就会在组件挂载完成后被调用
    mounted() {
      console.log(`The initial count is ${this.count}.`);
    },
    methods: {
      increment() {
        this.count++;
      },
    },
  };
</script>
<style lang="less" scoped>
  * {
    padding: 0;
    margin: 0;
  }
  .container {
    padding: 0 20px 20px 20px;
    background-color: #fff;
  }
  .arco-table-th {
    background-color: #fff !important;
  }
  .des {
    padding: 10px 0;
    font-size: 12px;
    line-height: 1.5;
    color: #515a6e;
  }
  .arco-table{
    margin-bottom:20px;
  }
</style>
